<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<link rel="shortcut icon" href="favicon.ico">
		<link href="../css/bootstrap.min14ed.css?v=3.3.6" rel="stylesheet">
		<link href="../css/font-awesome.min93e3.css?v=4.4.0" rel="stylesheet">
		<link href="../css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
		<link href="../css/animate.min.css" rel="stylesheet">
		<link href="../css/style.min862f.css?v=4.1.0" rel="stylesheet">
		<style type="text/css">
			tr:hover {
				background-color: #00BFFF;
			}

			td:hover {
				background-color: #00BFFF;
			}

			table {
				text-align: center;
			}

			table th {
				text-align: center;
			}
		</style>
	</head>
	<body>
		<div class="col-sm-12">
			<!-- Example Pagination -->
			<div class="example-wrap">
				<h2 class="example-title">委托单列表</h2>
				<button type="button" class="btn btn-info">新建委托单</button>
				<button type="button" class="btn btn-warning" id="daochu">导出excel</button>
				<table id="exampleTablePagination" data-toggle="table" data-url="js/demo/bootstrap_table_testqin.json"
				 data-query-params="queryParams" data-mobile-responsive="true" data-height="500" data-pagination="true"
				 data-icon-size="outline" data-search="true">
					<thead>
						<tr>
							<th data-field="state" data-checkbox="true"></th>
							<th data-field="project_name">工程名称</th>
							<th data-field="test_item">检测项目</th>
							<th data-field="test_unit">检测单位</th>
							<th data-field="entrust_number">委托流水号</th>
							<th data-field="sta">状态</th>
							<th data-field="unique_identifier">唯一标识</th>
							<th data-field="generate_time">生成时间</th>
							<th data-field="cao">操作</th>
						</tr>
					</thead>
				</table>
			</div>
		</div>
		<!-- End Example Pagination -->
		</div>
		<script src="../js/jquery.min.js?v=2.1.4">
			
		</script>
		<script src="../js/bootstrap.min.js?v=3.3.6"></script>
		<script src="../js/content.min.js?v=1.0.0"></script>
		<script src="../js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
		<script src="../js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
		<script src="../js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
		<script src="../js/demo/bootstrap-table-demo.min.js"></script>
		<script type="text/javascript" src="http://tajs.qq.com/stats?sId=9051096" charset="UTF-8"></script>
		<script type="text/javascript">
			$(function () {
			        $.ajax({
			            url: "https://examples.bootstrap-table.com/json/data1.json?order=asc",
			            success: function (result) {
			                // 初始化表格
							$("#daochu").click(function () {
			                    $('#exampleTablePagination').bootstrapTable('destroy').bootstrapTable({
			                        data: result,
			                        pagination: true,//显示分页
			                        clickToSelect: true,//单击列表选中
			                        toolbar: "#toolbar",//显示工具栏
			                        showToggle: true,//工具栏上显示列表模式切换
			                        showExport: true,//工具栏上显示导出按钮
			                        exportDataType: $(this).val(),//显示导出范围
			                        exportTypes: ['json', 'xml', 'png', 'csv', 'txt', 'sql', 'doc', 'excel', 'xlsx', 'pdf'],//导出格式
			                        exportOptions: {//导出设置
			                            fileName: 'Tablexxx',//下载文件名称
			                        },
			                        columns: [
			                            {
			                                field: 'state',
			                                checkbox: true,
			                                visible: $(this).val() === 'selected'
			                            },
			                            {
			                                field: 'id',
			                                title: 'ID'
			                            }, {
			                                field: 'name',
			                                title: 'Item Name'
			                            }, {
			                                field: 'price',
			                                title: 'Item Price'
			                            }
			                        ]
			                    })
			                }).trigger('change');
			            }
			        });
			    })
			    // 自定义按钮导出数据
			    function exportData(){
			        $('#table').tableExport({
			            type: 'excel',
			            exportDataType: "all",
			            ignoreColumn: [0],//忽略某一列的索引
			            fileName: 'Tablexxx',//下载文件名称
			            onCellHtmlData: function (cell, row, col, data){//处理导出内容,自定义某一行、某一列、某个单元格的内容
			                console.info(data);
			                return data;
			            },
			        });
			    }
		</script>
	</body>
</html>
